<template>
  <div class="step6">
    <!-- 上传PDF -->
    <UploadFile ref="upDateUploadFile" :FileUrl="fileUploadUrl" :isMultiple="false" :isAutoUpload="true" :Data="Data" :beforeAvatarUpload='beforeAvatarUpload' :handleAvatarSuccess="handleAvatarSuccess" :fileType="fileType"></UploadFile>
    <!-- 最新上传记录 -->
    <el-table :data="reportList" v-loading="listLoading"  stripe highlight-current-row>
      <el-table-column type="index" min-width="100"></el-table-column>
      <el-table-column prop="originname" label="文件名">
      </el-table-column>
      <el-table-column prop="createdAt" label="上传时间"></el-table-column>
      <el-table-column fixed="right" label="操作" width="130">
        <template slot-scope="scope">
          <el-button @click="fileDownload(scope.row)" icon="el-icon-download" size="small" type="primary"></el-button>
        </template>
      </el-table-column>
    </el-table>

    <el-card style="margin-top:20px;">
      <div slot="header" class="clearfix">
        <span>历史上传记录</span>
      </div>
      <el-table :data="historyList" v-loading="listLoading" stripe highlight-current-row>
        <el-table-column type="index" min-width="100"></el-table-column>
        <el-table-column prop="originname" label="文件名">
        </el-table-column>
        <el-table-column prop="createdAt" label="上传时间"></el-table-column>
        <el-table-column fixed="right" label="操作" width="130">
          <template slot-scope="scope">
            <el-button @click="fileDownload(scope.row)" icon="el-icon-download" size="small" type="primary"></el-button>
            <el-button  v-if="checkPermission(['manager'])" @click.native.prevent="handleDel(scope.$index, scope.row)" icon="el-icon-delete" size="small" type="danger"></el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-card>

  </div>
</template>
<script>
import checkPermission from "@/utils/permission"; // 权限判断函数
import { getReportLogList, deleteReportLog } from "@/api/reportLog";
import UploadFile from "@/components/Upload/UploadFile2";
import { updateProjectState } from "@/api/project";
export default {
  name: "Step6",
  props: ["getId"],
  components: { UploadFile },
  data() {
    return {
      fileType: "word",
      listLoading: false,
      reportList: [],
      historyList: [],
      listLoading: false,
      fileUploadUrl: "http://gsp.coldcloud.com/reportLog/upload",
      Data: {}
    };
  },
  created() {
    this.getList();
  },
  methods: {
    checkPermission,
    // 上传前文件校验
    beforeAvatarUpload(file) {
      const isWord =
        file.type == "application/msword" || file.type == "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
      const isLt5M = file.size / 1024 / 1024 < 5;
      if (!isWord) {
        this.$message.error("上传文件只能是word格式!");
      }
      if (!isLt5M) {
        this.$message.error("上传文件大小不能超过5MB!");
      }
      return isWord && isLt5M;
    },
    // pdf上传成功后
    handleAvatarSuccess(response, file, fileList) {
      this.$message({
        message: "报告上传成功",
        type: "success"
      });
      updateProjectState({ pid: this.getId, state: 1 }).then(_ => {
        this.$emit("changeState");
      });
      this.getList();
    },
    //获取列表
    getList() {
      this.listLoading = true;
      this.Data = { projectId: this.getId };
      getReportLogList({ projectId: this.getId }).then(response => {
        this.historyList = response.data.slice(1);
        this.reportList = response.data.slice(0, 1);
        this.listLoading = false;
      });
    },
    // 下载
    fileDownload(row) {
      window.open(row.url);
    },

    //删除
    handleDel(index, row) {
      console.log(row);
      this.$confirm("确认删除该报告吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        this.listLoading = true;
        deleteReportLog({ reportLogId: row.id }).then(() => {
          this.listLoading = false;
          this.$notify({
            title: "成功",
            message: "删除成功",
            type: "success",
            duration: 2000
          });
          this.getList();
        });
      }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
    }
  }
};
</script>

